<!--个人中心中 我的发布模块-->


<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head th:include="include/admin/adminHeader::html('管理员')"></head>

<style>
    div.container div.row div {
        margin: 5px 0px;
        text-align: center;
    }
</style>

<body>

<div>
    <div id="workingArea">
        <div class="container">
            <div class="row">
                <!--栅栏布局12列开始-->
                <div class="col-md-12">
                    <div th:replace="include/admin/adminNavigator::html"></div>
                </div>

                <!--面包屑导航-->
                <div class="col-md-12" style="text-align: left">
                    <ol class="breadcrumb">
                        <li><a href="/home">个人中心</a></li>
                        <li>我的发布</li>
                    </ol>
                </div>
                <!--栅栏布局3列-->
                <div class="col-md-3 col-sm-12 col-xs-12">
                    <div th:replace="include/admin/adminLeftMenu::html"></div>
                </div>


                <!--栅栏布局9列开始-->
                <div class="col-md-9 col-sm-12 col-xs-12 ">

                    <!--搜索框开始-->
                    <!--<div class="container">-->
                    <div class="  col-sm-12 col-xs-12  input-group">
                        <input type="text" v-model="keyword" class="form-control input-md" placeholder="暂不支持对审核人进行查找">
                        <span @click="search" class="input-group-addon btn btn-primary">搜索</span>
                        <span @click="all" class="input-group-addon btn btn-primary" th:text="显示全部"></span>
                    </div>
                    <!--</div>-->
                    <!--搜索框结束-->

                    <!--查询结果显示开始-->
                    <div>
                        <span class="text-muted">发布列表</span>
                        <table class="table table-striped table-bordered table-hover  table-condensed">
                            <thead>
                            <tr class="success">
                                <th>ID</th>
                                <th>作者</th>
                                <th>提交时间</th>
                                <th>文章标题</th>
                                <th>文章内容</th>
                                <th>文章类型</th>
                                <th>文章详情</th>
                                <!--<th>相关图片</th>-->
                                <!--<th>相关视频</th>-->
                                <th>审核人</th>
                                <th>审核时间</th>
                                <th>审核状态</th>
                                <!--<th>删除</th>-->
                                <!--<th>编辑</th>-->
                            </tr>
                            </thead>
                            <tbody>
                            <tr v-for=" bean in beans">
                                <td>{{bean.id}}</td>
                                <td>{{bean.user_write.realname}}</td>
                                <td>{{bean.refer_time|dateformat}}</td>
                                <!--<td><div id="dates" class="format">{{bean.refer_time}}</div></td>-->
                                <td>
                                    <p style="width: 100px;white-space: nowrap;text-overflow: ellipsis; overflow: hidden;"
                                       :title="bean.note_title">
                                        {{bean.note_title}}</p></td>
                                <td>
                                    <p style="width: 100px;white-space: nowrap;text-overflow: ellipsis; overflow: hidden;"
                                       :title="bean.note">
                                        {{bean.note}}</p></td>
                                <td>{{bean.note_type.name}}</td>
                                <td>
                                    <button @click="getBean(bean.id)" type="button" class="btn btn-info"
                                            data-toggle="modal" data-target="#model1">
                                        详情
                                    </button>
                                </td>

                                <!--模态框-->
                                <div id="model1" class="modal fade bs-example-modal-lg " tabindex="-1"
                                     role="dialog" aria-labelledby="myLargeModalLabel">
                                    <div style="margin:0 auto" class="modal-dialog modal-lg" role="document">

                                        <div class="modal-content" style="height: 800px">
                                            <div class="modal-header">
                                                文章信息
                                            </div>
                                            <div class="modal-body">
                                                <!--<div class=" col-md-12 col-sm-12 col-xs-12" style="background-color: #D1CCC8;width:100%;height:1000px">-->

                                                <h3 class="text-center">
                                                    <b>{{bean.note_title}}</b>
                                                </h3>
                                                <p style="width:100%">
                                                    <span v-html="bean.note"></span>
                                                </p>
                                                <!--</div>-->
                                            </div>
                                        </div>
                                    </div>
                                </div>
                                <!--<td v-if="null!=bean.image_url"><img height="30px" :src="'img/news/'+bean.image_url"></td>-->
                                <!--<td v-else>无</td>-->
                                <!--<td v-if="null!=bean.video_url">-->
                                <!--<a href="#nowhere" @click="getVideoUrl(bean.video_url)" data-toggle="modal" data-target="#myModal">-->
                                <!--<span class="glyphicon glyphicon-list"></span></a>-->
                                <!--</td>-->
                                <!--<td v-else>无</td>-->
                                <td v-if="null!=bean.user_read">{{bean.user_read.realname}}</td>
                                <td v-else>未审核</td>
                                <td v-if="null!=bean.auditor_time">{{bean.auditor_time|dateformat}}</td>
                                <td v-else>null</td>
                                <td v-if="null!=bean.user_read">{{bean.state}}</td>
                                <td v-else>null</td>
                                <!--<td><a href="#nowhere" @click="deleteBean(bean.id)">-->
                                <!--<span class="glyphicon glyphicon-trash"></span></a></td>-->
                                <!--<td><a href="#nowhere" @click="getBean(bean.id)" data-toggle="modal" data-target="#myModal">-->
                                <!--<span class="glyphicon glyphicon-edit"></span></a>-->
                                <!--</td>-->
                            </tr>
                            </tbody>
                        </table>
                    </div>
                    <!--查询结果显示结束-->

                    <!--分页显示-->
                    <div th:replace="include/admin/adminPage::html"></div>

                </div>
                <!--栅栏布局9列结束-->


            </div>
        </div>
    </div>
</div>

<!--前后端交互-->
<script>
    $(function () {
        /*时间格式化*/
        Vue.filter('dateformat', function (dataStr) {
            return moment(dataStr).format('YYYY-MM-DD HH:mm:ss')
        });

        /*文档加载开始*/
        var data4Vue = {
            uri: "new",
            pagination: {},
            beans: [],
            bean: {
                id: 0, user_write: {id: 0, realname: ""}, refer_time: "", note_type: {id: 0}, note_title: "", note: ""
                , image_url: "", video_url: "", user_read: {id: 0, realname: ""}, auditor_time: "", state: ""
            },
            keyword: "",
            is_search: "",
            video_url: ""
        };


        //ViewModel
        var vue = new Vue({
            el: '#workingArea',
            data: data4Vue,
            mounted: function () { //mounted　表示这个 Vue 对象加载成功了
                this.getUser();
                this.list(0);
            },
            methods: {
                getUser: function () {
                    this.bean.user_write.id = parseInt([[${session.user.id}]]);
                },
                list: function (start) {
//                    alert(1);
                    var url = this.uri + "?user_write_id=" + this.bean.user_write.id + "&start=" + start;
                    if (this.is_search)
                        url = this.uri + "_search" + "?keyword=" + this.keyword + "&user_write_id=" + this.bean.user_write.id + "&start=" + start;

                    axios.get(url).then(function (response) {
                        console.log(response.data);
                        vue.pagination = response.data.data;
                        vue.beans = response.data.data.content;

                    });
                },
                search: function () {
                    this.is_search = true;
                    var url = this.uri + "_search" + "?keyword=" + this.keyword + "&user_write_id=" + this.bean.user_write.id;
                    axios.get(url).then(function (response) {
                        console.log(response.data);
                        vue.pagination = response.data.data;
                        vue.beans = response.data.data.content;
                    })
                },
                all: function () {
                    this.is_search = false;
                    this.list(0);
                },
                getVideoUrl: function (video_url) {
                    this.video_url = video_url;
                },
                jump: function (page) {
                    jump(page, vue); //定义在adminHeader.html 中
                },
                jumpByNumber: function (start) {
                    jumpByNumber(start, vue);
                },
                logout: function () {
                    var url = "logout";
                    axios.post(url).then(function (response) {
                        console.log(response.data);
                        if (response.data.code == 0) location.href = "fore_login";
                    });
                },
                getBean: function (id) {
                    var url = this.uri + "/" + id;
                    axios.get(url).then(function (response) {
                        console.log(response.data);
                        vue.bean = response.data.data;
                    })
                }
            }
        });

        /*文档加载借宿*/
    });


</script>
</body>
</html>